{% extends 'admin_base.html' %}
{% import '_macros.html' as macros %}
{% block main %}
    <div class="panel-group" id="accordion">
        <div class="panel panel-default">
            {% for book_classify in paginate.items %}
                <div class="panel-heading">
                    <li class="list-group-item">
                        <h4 class="panel-title">

                            <a data-toggle="collapse" data-parent="#accordion" class="open-list"
                               href="#collapse_classify_{{ book_classify.id }}"
                               data-url="{{ url_for('get_books_list',book_classify_id=book_classify.id) }}">
                                {{ book_classify.name }}
                            </a>
                            <span class="badge pull-right">{{ book_classify.books|length }}</span>
                            <a class="btn pull-right opt_classify_del_book_a" data-toggle="modal"
                               style="margin-right: 20px;padding: 0px 25px;"
                               data-target="#modal-book_classify-del"
                               data-url="{{ url_for('book_classify_del',book_classify_id=book_classify.id) }}">删除</a>
                            <a class="btn pull-right opt_classify_del_book_a" data-toggle="modal"
                               onclick="set_modal(this)"
                               data-name="{{ book_classify.name }}" style="padding: 0px 25px;"
                               data-target="#modal-book_classify-add_or_update"
                               data-url="{{ url_for('book_classify_update',book_classify_id=book_classify.id) }}">修改</a>
                        </h4>
                    </li>
                </div>
                {#           折叠框 #}
                <div id="collapse_classify_{{ book_classify.id }}" class="panel-collapse collapse">
                    <div class="panel-body pagination-fill-div">
                    </div>
                </div>
            {% endfor %}
        </div>
        <a class="btn btn-primary pull-right opt_classify_del_book_a" data-toggle="modal" onclick="set_modal(this)"
           style="margin-top: 20px;"
           data-target="#modal-book_classify-add_or_update" data-url="{{ url_for('book_classify_add') }}"
        >添加图书分类
        </a>
        <a class="btn pull-right opt_book_a" style="margin-top: 20px;" data-toggle="modal"
           data-target="#modal-book_add_or_update" data-url="{{ url_for('opt_book_modal') }}"
        >添加图书
        </a>
        <div class="ajax-list-manage-book">
            {% block page %}
                {% if paginate.pages > 1 %}
                    {{ macros.pagination_widget_href_get(paginate,request.path) }}
                {% endif %}
            {% endblock %}
        </div>
    </div>

    {# 删除图书分类 #}
    <div class="modal fade" id="modal-book_classify-del" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <h4 class="text-center">将会删除所选项的<span></span>所有信息<br/><br/>确定要删除吗？</h4>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary classify_sure_btn" data-dismiss="modal">确定</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div>

    {#    添加&更新图书分类的模态框 #}
    <div class="modal fade" id="modal-book_classify-add_or_update" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="exampleModalLabel"></h4>
                </div>
                <div class="modal-body">
                    <form>
                        <div class="form-group">
                            <label for="message-text" class="control-label">图书分类名称：</label>
                            <textarea class="form-control" id="message-text"></textarea>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary classify_sure_btn" data-dismiss="modal">确定</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </div>
        </div>
    </div>
    {# 添加修改图书模态框 #}
    <div class="modal fade" id="modal-book_add_or_update" tabindex="-1" role="dialog"
         aria-labelledby="exampleModalLabel">
    </div>

    {# 图书详情 模态框 #}
    <div class="modal fade modal-book-detail" tabindex="-1" role="dialog" id="modal-comment-book"
         aria-labelledby="exampleModalLabel">
    </div>

    <script type="text/javascript">
        function set_modal(obj) {
            let title = $(obj).text();
            $("#modal-book_classify-add_or_update h4").text(title);
            let name = $(obj).data('name');
            if (!name)
                name = '';
            $("#modal-book_classify-add_or_update #message-text").text(name);
        }
    </script>
{% endblock %}

